<template>
  <el-container>
    <el-header>
      <el-row type="flex">
        <el-col :span="2">
          <el-button type="primary">添加资源路径</el-button>
          <el-dialog
              title="添加"
              :visible.sync="dialogVisible"
              width="30%">

          </el-dialog>
        </el-col>
      </el-row>
    </el-header>
    <el-main>
      <el-table :data="resourcesList">
        <el-table-column label="资源名称" width="180" prop="resourceName" />
        <el-table-column label="路径代码" width="180" prop="resourceCode" />
        <el-table-column label="资源描述" width="180" prop="resourceDesc" />
        <el-table-column label="创建时间" width="180" prop="createTime" :formatter="timeFilter"/>
        <el-table-column label="修改时间" width="180" prop="updateTime" :formatter="timeFilter"/>
        <el-table-column label="操作" width="180">
          <template slot-scope="scope">
            <el-button type="text" size="mini" @click="">修改</el-button>
            <el-button type="text" size="mini">删除</el-button>
          </template>
        </el-table-column>
      </el-table>
    </el-main>
    <el-footer>
      <el-pagination
          @size-change="handleSizeChange"
          @current-change="handleCurrentChange"
          :current-page.sync="currentPage"
          :page-size="sizePage"
          layout="total, prev, pager, next"
          :total="total">
      </el-pagination>
    </el-footer>


  </el-container>

</template>

<script>
import { formateDate } from "@/util/TimeFormat";
import { resourceList } from "@/api/Resources";

export default {
  name: "ResourcesTab",
  data(){
    return{
      resourcesList: [],
      currentPage: 1,
      sizePage: 10,
      total: 0,
      dialogVisible: false
    }
  },

  created() {
    this.getResourecsList()
  },

  methods: {

    getResourecsList(){
      resourceList(this.currentPage, this.sizePage).then(res => {
        this.total = res.data.data.total
        this.resourcesList = res.data.data.list
      })
    },

    handleSizeChange(val){},

    handleCurrentChange(val){},

    timeFilter(row, column, cellValue, index){
      var date = new Date(cellValue * 1000);
      return formateDate(date, "yyyy年MM月dd日")
    },
  }
}
</script>

<style scoped>

</style>